<template>
  <div>
    <el-container>
      <el-main style="height: 640px">
        <el-card class="t-box-card">
          <div slot="header" style="height: 20px">
            <el-button style="float: left; padding: 3px 0" type="text">上传题目</el-button>
          </div>
          <div slot="header">
          </div>
          <el-form ref="form" :model="uploadForm" label-width="80px">
            <el-form-item label="题型">
              <el-radio-group v-model="uploadForm.topicTypeId"  style="float:left;margin-top: 13px;margin-left: 30px">
                <el-radio :label="o.id" v-for="o in typeList" :key="index" style="color: #67C23A">{{o.value}}</el-radio>
              </el-radio-group>
            </el-form-item>

            <el-form-item label="科目">
              <el-radio-group v-model="uploadForm.objectId"  style="float:left;margin-top: 13px;margin-left: 30px">
                <el-radio :label="o.id" v-for="o in objectList" :key="index"style="color: #E6A23C">{{o.value}}</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="难度">
              <el-radio-group v-model="uploadForm.difficultyLevelId"  style="float: left;margin-top: 13px;margin-left: 30px">
                <el-radio :label="o.id" v-for="o in difficultList" :key="index" style="color: #67C23A">{{o.value}}</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="题目标题">
              <el-input v-model="uploadForm.title" placeholder="标题要贴合题目哦" style="width: 900px"></el-input>
            </el-form-item>
            <el-form-item label="题目内容">
              <el-input type="textarea" v-model="uploadForm.content" placeholder="快输入内容吧" style="width: 900px"></el-input>
            </el-form-item>
            <el-form-item label="答案">
              <el-input type="textarea" v-model="uploadForm.answer" placeholder="答案可以不填写" style="width: 900px"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="uploadTopicButton">立即上传</el-button>
              <el-button>取消</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-main>
    </el-container>
  </div>
</template>

<script>
export default {
  name: "uploadTopic",
  data(){
    return{
      uploadForm:{
        topicTypeId: '',
        objectId: '',
        difficultyLevelId: '',
        title: '',
        content: '',
        answer:'',
      },
      difficultList:[{
        id : '',order: '',type: '',value: ''
      }],
      objectList:[{
        id : '',order: '',type: '',value: ''
      }],
      typeList:[{
        id : '',order: '',type: '',value: ''
      }]
    }
  },
  methods:{
    //获取题型、科目、难度
    getTopicAbout(){
      this.$axios.post("/api/uploadTopic/getTopicAboutJ").then(resp=>{
        this.difficultList=resp.data.data.difficultList
        this.objectList=resp.data.data.objectList;
        this.typeList=resp.data.data.typeList;
        console.log(resp);
      })
    },
    //上传按钮
    uploadTopicButton(){
      //alert(this.uploadForm.topicTypeId)
      if(this.uploadForm.topicTypeId==null || this.uploadForm.topicTypeId==''){
        this.$message({
          message: '请选择题型',
          type: 'error'
        });
      }else if(this.uploadForm.difficultyLevelId==null || this.uploadForm.difficultyLevelId==''){
        this.$message({
          message: '请选择难度等级',
          type: 'error'
        });
      }else if(this.uploadForm.objectId==null || this.uploadForm.objectId==''){
        this.$message({
          message: '请选择科目',
          type: 'error'
        });
      }else if(this.uploadForm.title==null || this.uploadForm.title==''){
        this.$message({
          message: '请输入标题',
          type: 'error'
        });
      }else if(this.uploadForm.content==null || this.uploadForm.content==''){
        this.$message({
          message: '请输入题目内容',
          type: 'error'
        });
      }else{
        this.$axios.post("/api/uploadTopic/goUploadTopicJ",this.uploadForm).then(resp=>{
          console.log(resp);
          this.$message({
            message: '添加题目成功',
            type: 'success'
          });
        })
      }
    }
  },
  created() {
    this.getTopicAbout();
  }
}
</script>

<style>
.t-text {
  font-size: 14px;
  height: 70px;
  margin-left: -1000px;
}

.t-item {
  margin-bottom: 18px;
}

.t-clearfix:before,
.t-clearfix:after {
  display: table;
  content: "";
}
.t-clearfix:after {
  clear: both;
}

.t-box-card {
  width: 1100px;
}

</style>